<template>
  <base-breadcrumb :title="$route.meta.title">
    <a-form-model ref="ruleForm" :model="form" :label-col="{ span: 6 }" :wrapper-col="{ span: 18 }" :rules="editModel == 0 ? {} : rules">
      <a-spin :spinning="loading">
        <!-- 表格 -->
        <a-card :bordered="false">
          <a-tabs default-active-key="1" :animated="false">
            <a-tab-pane key="1" tab="公司设计管理重点工作开展情况">
              <title-name title="公司设计管理重点工作开展情况"></title-name>
              <custom-form :formList="formList" :form="form" :is-emit="false" :editModel="editModel == 0 ? '' : ''"> </custom-form>
              <title-name title="问题及建议"></title-name>
              <custom-form :formList="formListTwo" :form="form" :is-emit="false" :editModel="editModel == 0 ? '' : ''"> </custom-form>
            </a-tab-pane>
            <a-tab-pane key="2" tab="项目设计优化及通过情况">
                <ProjectDesign :id="id"></ProjectDesign>
            </a-tab-pane>
            <a-tab-pane key="3" tab="公司双优化累计完成情况">
              <CorporateDouble :id="id"></CorporateDouble>
            </a-tab-pane>
            <a-tab-pane key="4" tab="总累计通过审批立项数">
              <CumulativePass :id="id"></CumulativePass>
            </a-tab-pane>
            <a-tab-pane key="5" tab="设计策划情况">
              <DesignPlan :id="id"></DesignPlan>
            </a-tab-pane>
          </a-tabs>
        </a-card>
      </a-spin>
    </a-form-model>
    <div class="btn_box page-btn-right-top" v-if="editModel != 0">
      <a-button class="button_right" type="primary" :loading="loadingBtn.REJECTED" @click="handleSubmit('REJECTED')">保存草稿</a-button>
      <a-button class="button_right" type="primary" :loading="loadingBtn.SUBMITTED" @click="handleSubmit('SUBMITTED')">提交</a-button>
      <a-button @click="handleActiveClose">关闭</a-button>
    </div>
    <div class="btn_box page-btn-right-top" v-else>
      <a-button @click="handleActiveClose">关闭</a-button>
    </div>
  </base-breadcrumb>
</template>
<script>
import BaseEditPage from '@/views/baseEditPage' // 编辑详情页基础配置
import ProjectDesign from './components/projectDesign'
import CorporateDouble from './components/corporateDouble'
import CumulativePass from './components/cumulativePass'
import DesignPlan from './components/designPlan'
import {
  updateByPrimaryKeySelective,
  getMonthDesignById
  } from '@/api/design/monthlyReport/monthlyWorkReport'
  
export default {
  name: 'a' + Date.now(),
  extends: new BaseEditPage(),
  data() {
    return {
      loading: false, // 加载控件
      loadingBtn:{
        REJECTED:false,
        SUBMITTED:false
      },
      editModel: 0, // 操作状态:0 查看;1 编辑;2 新增
      rules: {
        workPlan: [{ required: true, message: '请输入月工作计划', trigger: 'blur' }],
        workComplete: [{ required: true, message: '请输入月工作完成情况', trigger: 'blur' }],
        problemsSuggestions: [{ required: true, message: '请输入问题及建议', trigger: 'blur' }]
      }, // 校验规则
      form: {
      }, // 表单
      month:this.$route.query.month,
      id:'',
    }
  },
  components: {
    ProjectDesign,
    CorporateDouble,
    CumulativePass,
    DesignPlan
  },
  computed: {
    formList() {
      return [
        {
          keyName: 'workPlan',
          type: 'BaseTextarea',
          disabled: this.editModel == 0,
          label: `${this.month}月工作计划`,
          span: 24,
          attrs: {
           maxLength: 3000
         },
        },
        {
          keyName: 'workComplete',
          type: 'BaseTextarea',
          disabled: this.editModel == 0,
          label: `${this.month}月工作完成情况`,
          span: 24,
          attrs: {
           maxLength: 3000
         },
        }
      ]
    },
    formListTwo() {
      return [
        {
          keyName: 'problemsSuggestions',
          type: 'BaseTextarea',
          disabled: this.editModel == 0,
          label: '问题及建议',
          span: 24,
          attrs: {
           maxLength: 3000
         },
        }
      ]
    }
  },
  methods:{
    validateForm() {
      let flag = false
      this.$refs.ruleForm.validate((e) => {
        if (e) {
          flag = true
        } else {
          this.$message.warning("请填写完所有必填项信息")
        }
      })
      return flag
    },
    handleSubmit(status){
      let obj = {
        id:this.id,
        month:this.month,
      };
      let req = {...obj,...this.form};
      req.editUser = this.$userInfo().name
      req.auditStatus = status =='SUBMITTED'? 'SUBMITTED':'DRAFT';
      if (status == 'SUBMITTED' && !this.validateForm()) {
        return
      }
      this.loading = true;
      updateByPrimaryKeySelective(req).then(res=>{
        if(res.code == 200){
          this.loading = false
          this.$message.success(status == 'SUBMITTED' ? '提交成功！' : '保存成功')
          this.$close()
        }
      }).catch(() => {
          this.loading = false
          this.$message.warning(err.data.message)
        })

    },
    getMonthDesignByIdFn(id){
      this.loading = true;
      getMonthDesignById({id:id}).then((res)=>{
        if(res.code == 200){
          this.loading = false
          this.form = { ...this.form, ...res.data }
        }
      }).catch(() => {
          this.loading = false
          this.$message.warning(err.data.message)
        })
    },
  },
  mounted(){
      if(this.id){
        this.getMonthDesignByIdFn(this.id);
      }
  }
}
</script>
<style lang="less" scoped>
   ::v-deep.titleName{
    margin-top:10px!important;
  }

</style>